

$(function () {
var operid = 0;
var perSize = 4;
var currentPage = 1;//当前页数
var totalPage = -1;

// 清空初始化加载时加载的数据
depotArray = [];
// ajax默认是异步处理状态，异步处理状态是非阻塞状态
$.ajax({
url:"DepartmentServlet",            // 查询所有部门
type:"post",                // 请求的方式，不区分大小写
async:true,                 // 是否异步，true是默认值，false为同步请求
cache:false,                // 关闭缓存，目的是为了避免部分浏览器缓存加载出错(IE)
contentType:"application/json;charset=utf-8",
datatype:"json",            // 返回类型，text文本、html页面、json数据
// data:JSON.stringify(obj), // 全部查询，不需要请求参数
success:function(data){
alert("成功数据: " + JSON.stringify(data));
for(var i = 0; i < data.length; i++) {
var onlyJSON = data[i];
depotArray[i] = {
"depotId": onlyJSON.depotId,
"depotName": onlyJSON.depotName,
"depotSetTime": new Date(onlyJSON.depotSetTime).toLocaleDateString(),
"depotDescribe": onlyJSON.depotDescribe};
}
//  目前通过一个ajax异步请求获取了后台的部门数据
//  将后台的数据转换为 depotArray
//  这是应该执行方法 让depotArray 的数据显示在页面
displayUserTable();
add();
update();
pageClick();
pagebar();
checkAll();
singalChecked();
},
error:function(response){
alert("失败数据: " + JSON.stringify(response));
}
});

function add() {
$("#btnAddForm").click(function () {
operid = -1;
$("#myModal").modal();
});
$("#btnAdd").click(function () {
//添加数据
//获取表单数据
var id = $("#txtId").val();
var depName = $("#txtdepName").val();
var date = $("#txtDate").val();
var describe = $("#txtDescribe").val();

var obj = {"depotId": id, "depotName": depName, "depotSetTime": date, "depotDescribe": describe};

if (operid == -1) {
depotArray.push(obj);

} else {
depotArray.splice(operid, 1, obj);
}

displayUserTable();
pagebar();
$("#myModal").modal("hide");
})
}


function checkAll() {
let allChecked = false;
$("#checkAll").on("click", function () {
if (!allChecked) {
$("#depTable").find("input").each(function (index, element) {
$(element).prop("checked", true);
allChecked = true;
});
}
else {
$("#depTable").find("input").each(function (index, element) {
$(element).prop("checked", false);
allChecked = false;
})
}
});
}

function singalChecked() {
$("#depTable").find("input").each(function (index, element) {
$("#depTable").on("mousedown", $(element), function () {
$("#depTable").find("input").prop("checked", false);
});
});
}

function update() {
$("#btnEditForm").on("click", function () {

let index = parseInt($("#depTable").find(":checked").parents("tr").find(".hidden").text());
console.log(index);
$("#txtDepartment").val(depotArray[index].depotName).prop("readOnly", true);
$("#txtSetTime").val(depotArray[index].depotSetTime).prop("readOnly", true);
$("#txtDescribe1").val(depotArray[index].depotDescribe);
$("#editDepartment").modal();
$("#btnAdd1").unbind('click');
undateExcute(index);
});
}

function undateExcute(index) {
$("#btnAdd1").click(function () {

//更新数据
//获取表单数据
depotArray[index].depotDescribe = $("#txtDescribe1").val();
displayUserTable();
$("#editDepartment").modal("hide");
})
}

//显示表的主体数据
function displayUserTable() {
$("#depTable").html("");
$("#checkAll")[0].checked = false;
var start = (currentPage - 1) * perSize;
var end = start + perSize;
var outHtml = "";
for (var i = start; i < end && i < depotArray.length; i++) {
outHtml += `<tr>
<td class="hidden">${i}</td>
<td><input type='checkbox' name='checkItem' /></td>
<td>${depotArray[i].depotId}</td>
<td>${depotArray[i].depotName}</td>
<td>${depotArray[i].depotSetTime}</td>
<td>${depotArray[i].depotDescribe}</td>
</tr>`;
}
$("#depTable").html(outHtml);
}

//用于显示页码
function pagebar(index) {
totalPage = Math.ceil(depotArray.length / perSize);
if (currentPage > totalPage) {
currentPage = totalPage;
}
currentPage = index || currentPage;
$("#divPage").html("");
var str = "";

for (var i = 0; i < totalPage; i++) {
if (currentPage == (i + 1)) {
str += `<button class='btn btn-primary page'>${i + 1}</button>`;
} else {
str += `<button class='btn btn-default page'>${i + 1}</button>`;
}
}

$("#divPage").html(str);
}

function pageClick() {
$("#divPage").on("click", ".page", function () {
$(".page").each(function () {
$(this).removeClass("btn-primary");
});
$(this).addClass("btn-primary");
currentPage = Number(this.innerText);
displayUserTable();
});

$("#pageNext").click(function () {
if (currentPage == $("#divPage").children().length) {
return 0;
} else {
currentPage++;
displayUserTable();
pagebar(currentPage);
}
});

$("#pagePrevious").click(function () {
if (currentPage == 1) {
alert("已是第一页");
} else {
currentPage--;
displayUserTable();
pagebar(currentPage);
}
})

}
});